import 'package:flutter/material.dart';
import 'package:flutter_learn_vi/src/page/special/special_list_page.dart';

import '../mine/account/widget/account_special_details_widget.dart';

class SpecialMainPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _SpecialMainPageState();
  }
}

class _SpecialMainPageState extends State<SpecialMainPage> {
  int _currentSelect = 1;

  //严重三违 2潜力员工 3 不胜任岗位
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return [buildSliverAppBar()];
        },
        body: buildAnimatedSwitcher(context),
      ),
    );
  }

  Widget buildSliverAppBar() {
    return SliverAppBar(
      //标题居中
      centerTitle: true,
      title: Text("专项积分"),
      //5.1.2小节中有对这一块的属性配置说明
      pinned: true,
      floating: false,
      snap: false,
      //阴影高度
      elevation: 0.0,
      //展开的高度
      expandedHeight: 190,
      flexibleSpace: FlexibleSpaceBar(
        //背景
        //配置的是一个widget也就是说在这里可以使用任意的
        //Widget组合 在这里直接使用的是一个图片
        background: buildFlexibleSpaceWidget(),
      ),
      //第三部分
      bottom: PreferredSize(
        preferredSize: Size(double.infinity, 44),
        child: Container(
          height: 44,
          color: Colors.white,
          child: Row(
            children: [
              Expanded(
                child: GestureDetector(
                  onTap: () {
                    setState(() {
                      _currentSelect = 1;
                    });
                  },
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Text(
                        "严重三违",
                        textAlign: TextAlign.center,
                        style: TextStyle(
                            color: _currentSelect == 1
                                ? Colors.black
                                : Colors.grey),
                      ),
                      SizedBox(height: 8),
                      _currentSelect == 1
                          ? Container(
                              height: 3,
                              width: 20,
                              color: Colors.black,
                            )
                          : SizedBox(
                              height: 3,
                            ),
                    ],
                  ),
                ),
              ),
              Expanded(
                child: GestureDetector(
                  onTap: () {
                    setState(() {
                      _currentSelect = 2;
                    });
                  },
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Text(
                        "潜力员工",
                        textAlign: TextAlign.center,
                        style: TextStyle(
                            color: _currentSelect == 2
                                ? Colors.black
                                : Colors.grey),
                      ),
                      SizedBox(height: 8),
                      _currentSelect == 2
                          ? Container(
                              height: 3,
                              width: 20,
                              color: Colors.black,
                            )
                          : SizedBox(
                              height: 3,
                            ),
                    ],
                  ),
                ),
              ),
              Expanded(
                child: GestureDetector(
                  onTap: () {
                    setState(() {
                      _currentSelect = 3;
                    });
                  },
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Text(
                        "不胜任岗位",
                        textAlign: TextAlign.center,
                        style: TextStyle(
                            color: _currentSelect == 3
                                ? Colors.black
                                : Colors.grey),
                      ),
                      SizedBox(height: 8),
                      _currentSelect == 3
                          ? Container(
                              height: 3,
                              width: 20,
                              color: Colors.black,
                            )
                          : SizedBox(
                              height: 3,
                            ),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  ///AnimatedSwitcher 的基本使用
  AnimatedSwitcher buildAnimatedSwitcher(BuildContext context) {
    return AnimatedSwitcher(
      //动画执行切换时间
      duration: const Duration(milliseconds: 400),
      //动画构建器 构建指定动画类型
      transitionBuilder: (Widget child, Animation<double> animation) {
        //执行缩放动画
        return FadeTransition(child: child, opacity: animation);
      },

      ///执行动画的子 Widget
      ///只有子 Widget 被切换时才会触发动画
      child: SpecialListPage(
        key: ValueKey("$_currentSelect"),
        recoderType: _currentSelect,
      ),
    );
  }

  buildFlexibleSpaceWidget() {
    return Column(
      children: [
        SizedBox(
          height: 72,
        ),
        SpecialAccountDetailsWidget(tag: "special")
      ],
    );
  }
}
